<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org">
<html>
<head>
    <meta charset="utf-8">
    <title>layui</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="/css/yoyoga.css" media="all"/>
    <script type="text/javascript" src="/layui/layui.js"></script>
    <script type="text/javascript" src="/libs/jquery.min.js"></script>


</head>
<body>

<div class="main-content-container" id="gymInfo">
    <!-- 场馆图片展示轮播图 -->
    <div class="layui-carousel" id="gymImage">
        <div carousel-item>
            <div>场馆图片</div>
            <div>场馆图片</div>
            <div>场馆图片</div>
            <div>场馆图片</div>
            <div>场馆图片</div>
        </div>
    </div>

    <div class="layui-collapse colla-default">
        <div class="layui-colla-item">
            <h2 class="layui-colla-title">场馆介绍</h2>
            <div class="layui-colla-content layui-show" id="gymIntro" th:text="${gymInfo.gIntroduction}"></div>
        </div>
        <div class="layui-colla-item">
            <h2 class="layui-colla-title">驻店私教</h2>
            <div class="layui-colla-content layui-show" id="trainersOfGym">
                <div class="gym-detail-trainer-container">
                    <div class="gym-detail-trainer-single" th:each="trainer : ${trainerList}">
                        <a th:href="@{'/trainer/singleTrainer?tId='+${trainer.tId}+'&gId='+${gymInfo.gId}}">
                        <img src="/image/portrait.png" class="gym-detail-trainer-img"/>
                        <p th:text="${trainer.tName}"/>
                        </a>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-colla-item">
            <h2 class="layui-colla-title">评价</h2>
            <div class="layui-colla-content layui-show" id="gymEvaluation">内容区域<br><br></div>
        </div>
    </div>
    <div id="agreementState" style="font-size: x-large; color: red" ></div>
    <button class="layui-btn contract-detail-button" onclick="applyEnter()" id="applayEnter">申请入驻</button>
    <br><br><br><br><br><br><br>
</div>



<!--折叠面板-->
<script>
    //注意：折叠面板 依赖 element 模块，否则无法进行功能性操作
    layui.use('element', function(){
        var element = layui.element;
    });
</script>

<!-- head -->
<script>
    layui.use('element', function() {
        var element = layui.element; //导航的hover效果、二级菜单等功能，需要依赖element模块
        //监听导航点击
        element.on('nav(demo)', function(elem) {
            //console.log(elem)
            layer.msg(elem.text());
        });
    });
</script>
<!--场馆图片轮播图-->
<script>
    layui.use('carousel', function(){
        var carousel = layui.carousel;
        //建造实例
        carousel.render({
            elem: '#gymImage'
            ,width: '100%' //设置容器宽度
            ,arrow: 'always' //始终显示箭头
            //,anim: 'updown' //切换动画方式
        });
    });
</script>

<script th:inline="javascript">
    var usertype = [[${session.userType}]];
    var gId = [[${gymInfo.gId}]];

    $(function () {
        if(usertype!='1'){
            $("#applayEnter").hide();
            $("#agreementState").hide();
            return ;
        }
        //查询该场馆是否已经和教练签约
        $.ajax({
            url:"/trainer/ongoingAgreement",
            data:{
                "gId":gId
            },
            success:function (data) {
                if(data!=null){
                    switch (data.taState) {
                        case 0:
                            $("#agreementState").html("场馆正在处理您的入驻请求");
                            break;
                        case 1:
                            $("#agreementState").html("该场馆邀您入驻，前去我的场馆页处理");
                            break;
                        case 4:
                            $("#agreementState").html("您已入驻该场馆");
                            break;
                    }
                    $("#applayEnter").hide();
                }
            }

        })
    })

    function applyEnter() {
        if(!confirm("入驻该馆，场馆将从每次课程费用中10%作为管理费（由于系统缺少字段，暂时写死)")){
            return;
        }
        $.ajax({
            url:"/trainer/createTrainerGymAgreement",
            type:"post",
            data:{
                "gId":gId
            },
            success:function (data) {
                if(data.result=='success'){
                    alert("签约成功！");
                    window.location.href="/html/myGym.html";
                }else {
                    alert(data.reason);
                }
            }
        })
    }
</script>

</body>
</html>
